import Vue from 'vue'
import App from './App.vue'
import router from './router'
// 全局的路由守卫
router.beforeEach((to, from, next) => {
  //获取本地的token
  const token = localStorage.getItem("token");
  //是否是个人中心页面
  console.log('目标路由', to)
  const patharr = ['/edit', '/profile'];
  //这里通过indexOf来检验to.path有没有edit和profile页面
  if (patharr.indexOf(to.path) > -1) {

    if (token) {
      return next();
    } else {
      return router.push({
        path: '/login'
      }).catch(err => {
        //这里catch捕获了错误，在前端就不会显示了

      });
    }
  } else {
    //这里有个保底的操作,其他页面直接放行
    next();
  }

})
// 引入vant组件
import Vant from "vant";
import 'vant/lib/index.css';
import { RadioGroup, Radio } from 'vant';
Vue.use(Radio);
Vue.use(RadioGroup);
import { Toast } from 'vant'; //在main.js中全局使用Toast
//将Toast注入到vue中，这样在vue根实例中就可以通过this.xxx使用,如果不需要可以省略
Vue.use(Toast);
// 注册组件库，将组件注入到vue实例中
Vue.use(Vant);
// 引入axios
import axios from "axios";
//绑定到原型
Vue.prototype.$axios = axios;
// 设置基准路径
axios.defaults.baseURL = "http://liangwei.tech:3000"
//axios请求拦截器，如果本地有token,自动添加token
axios.interceptors.request.use((config) => {
  if (!config.headers.Authorization && localStorage.getItem('token')) {
    //如果拦截的配置中的headers(头部)没有token授权，且本地又有token，那么将自动带上token
    config.headers.Authorization = localStorage.getItem('token');
  }
  //放行请求配置
  return config;
})

// //axios拦截器，响应拦截器
axios.interceptors.response.use((res) => {
  //所有的axios响应都会被监听到
  console.log("这里数据被拦截了")
  const { statusCode, message } = res.data;
  //错误正则
  const errorRegExp = /^4\d\d$/;
  if (statusCode && errorRegExp.test(statusCode)) {
    Toast.fail(message || "系统错误");
    if (message === "用户信息验证失败") {
      localStorage.removeItem('id');
      localStorage.removeItem('token');
      router.push("/login");
    }
  }

  //这里一定要返回res，否则其他组件接收不到res;
  return res;
})

Vue.config.productionTip = false

new Vue({
  router,
  render: h => h(App)
}).$mount('#app')
